<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/css_reset.css">
    <link rel="stylesheet" href="css/radio .css">
    <link rel="stylesheet" href="css/footer.css">
    <link rel="stylesheet" href="css/header.css">
</head>

<body>
    <div class="container">
        <div class="header">
            <div class="header_top">
                <h1>
                    <a href="#"><img src="https://y.qq.com/mediastyle/yqq/img/logo.png" alt=""></a>
                </h1>
                <ul class="big_nav">
                    <li><a href="#">音乐馆</a></li>
                    <li><a href="#">我的音乐</a></li>
                    <li><a href="#">客户端</a></li>
                    <li><a href="#">开放平台</a></li>
                    <li><a href="#">VIP</a></li>
                </ul>

                <input type="search" placeholder="搜索音乐、MV、歌单、用户">
                <a href="#"><i class="icon"></i></a>
                <a href="#" class="login">
                    <p>登录</p>
                </a>
                <ul class="vip">
                    <li>开通VIP<i></i>
                        <ul class="vip1">
                            <li>开通绿钻豪华版</li>
                            <li>开通付费包</li>
                        </ul>
                    </li>
                </ul>
                <ul class="recharge">
                    <li>充值<i></i>
                        <ul class="recharge1">
                            <li>充值乐币</li>
                            <li>充值饭票</li>
                        </ul>
                    </li>
                </ul>

            </div>
            <div class="header_bottom">
                <ul>
                    <li><a href="/index.html">首页</a></li>
                    <li><a href="/singer1.html">歌手</a></li>
                    <li><a href="/songdisc.html">新碟</a></li>
                    <li><a href="/Ranking_list.html">排行榜</a></li>
                    <li><a href="/classify.html">分类歌单</a></li>
                    <li><a href="/radio_station.html">电台</a></li>
                    <li><a href="/mv.html">MV</a></li>
                    <li><a href="/Digital_album.html">数字专辑</a></li>
                    <li><a href="#">票务</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="alltian">
        <div class="left">
            <ul class="nav">
                <li><a href="#mao1">热门</a></li>
                <li><a href="#mao2">心情</a></li>
                <li><a href="#mao3">主题</a></li>
                <li><a href="#mao4">场景</a></li>
            </ul>
        </div>
        <div class="right">
            <div class="right1">
                <a name="mao1">
                    <h2 class="radio__tit">热门</h2>
                </a>
                <ul class="bodyer">
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=99">
                            <div class="inner"><img src="images/1.jpg" alt="个性电台"></div>
                            <h4>个性电台</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=101">
                            <div class="inner"><img src="images/2.jpg" alt="随心听"></div>
                            <h4>随心听</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=567">
                            <div class="inner"><img src="images/3.jpg" alt="抖音神曲"></div>
                            <h4>抖音神曲</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=686">
                            <div class="inner"><img src="images/4.jpg" alt="深度催眠"></div>
                            <h4>深度催眠</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=673">
                            <div class="inner"><img src="images/5.jpg" alt="情感治愈站"></div>
                            <h4>情感治愈站</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=270">
                            <div class="inner"><img src="images/6.jpg" alt="KTV必点歌"></div>
                            <h4>KTV必点歌</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=127">
                            <div class="inner"><img src="images/7.jpg" alt="经典"></div>
                            <h4>经典</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=167">
                            <div class="inner"><img src="images/8.jpg" alt="网络流行"></div>
                            <h4>网络流行</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=703">
                            <div class="inner"><img src="images/9.jpeg" alt="宝宝胎教"></div>
                            <h4>宝宝胎教</h4>
                        </a>
                    </li>
                    <li>
                </ul>
            </div>
            <div class="right2">
                <a name="mao2">
                    <h2 class="radio__tit1">心情</h2>
                </a>
                <ul>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=136">
                            <div class="inner"><img src="images/10.jpg" alt="忧伤"></div>
                            <h4>忧伤</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=140">
                            <div class="inner"><img src="images/11.jpg" alt="快乐"></div>
                            <h4>快乐</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=211">
                            <div class="inner"><img src="images/12.jpg" alt="平静"> </div>
                            <h4>平静</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=572">
                            <div class="inner"><img src="images/13.jpg" alt="兴奋"> </div>
                            <h4>兴奋</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=137">
                            <div class="inner"><img src="images/14.jpg" alt="寂寞"></div>
                            <h4>寂寞</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=217">
                            <div class="inner"><img src="images/15.jpg" alt="治愈"></div>
                            <h4>治愈</h4>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="right3">
                <a name="mao3">
                    <h2 class="radio__tit2">主题</h2>
                </a>
                <ul>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=199">
                            <div class="inner"><img src="images/16.jpg" alt="热歌"></div>
                            <h4>热歌</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=126">
                            <div class="inner"><img src="images/17.jpg" alt="新歌"></div>
                            <h4>新歌</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=550">
                            <div class="inner"><img src="images/18.jpg" alt="情歌"></div>
                            <h4>情歌</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=554">
                            <div class="inner"><img src="images/19.jpg" alt="影视原声"></div>
                            <h4>影视原声</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=347">
                            <div class="inner"><img src="images/20.jpg" alt="车载"></div>
                            <h4>车载</h4>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="right4">
                <a name="mao4">
                    <h2 class="radio__tit3">场景</h2>
                </a>
                <ul>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=368">
                            <div class="inner"><img src="images/21.jpg" alt="睡前"></div>
                            <h4>睡前</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=682">
                            <div class="inner"><img src="images/22.jpg" alt="助眠白噪音"></div>
                            <h4>助眠白噪音</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=368">
                            <div class="inner"><img src="images/23.jpg" alt="起床"></div>
                            <h4>起床</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=368">
                            <div class="inner"><img src="images/24.jpg" alt="旅行"></div>
                            <h4>旅行</h4>
                        </a>
                    </li>
                    <li>
                        <p><i></i></p>
                        <a href="https://y.qq.com/portal/player_radio.html#id=368">
                            <div class="inner"><img src="images/25.jpg" alt="咖啡馆"></div>
                            <h4>咖啡馆</h4>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
   </div>
    <div class="footerbodyer">
        <div>
            <div class="footerleft">
                <div>
                    <h4>下载QQ音乐客户端</h4>
                </div>
                <div>
                    <ul class="icons">
                        <a href="#">
                            <li>
                                <p>PC版</p>
                            </li>
                        </a>
                        <li>
                            <p>Mac版</p>
                        </li>
                        <li>
                            <p>Android版</p>
                        </li>
                        <li>
                            <p>iphone版</p>
                        </li>
                    </ul>
                </div>
                <div>
                    <h3>开放平台</h3>
                    <ul class="icons1">
                        <li><a href="">QQ音乐开放平台</a></li>
                        <li><a href="">腾讯音乐人</a></li>
                    </ul>
                </div>
            </div>
            <div class="footermiddle">
                <div>
                    <h4>特色产品</h4>
                </div>
                <div>
                    <ul class="iconss">
                        <li>
                            <p>全民k歌</p>
                        </li>
                        <li>
                            <p>Super&nbsp;Sound</p>
                        </li>
                        <li>
                            <p>Qplay</p>
                        </li>
                        <li>
                            <p>Fan直播伴侣</p>
                        </li>
                    </ul>
                </div>
                <div>
                    <h3>TME集团官网</h3>
                    <ul class="icons2">
                        <li><a href="">腾讯音乐</a></li>
                    </ul>
                </div>
            </div>
            <div class="footerright">
                <h4>合作链接</h4>
                <div class="iconsss">
                    <ul>
                        <li><a href="">CJ&nbsp;ENM</a></li>
                        <li><a href="">最新版QQ</a></li>
                        <li><a href="">QQ浏览器</a></li>
                        <li><a href="">企鹅FM</a></li>
                        <li><a href="">手机QQ空间</a></li>
                        <li><a href="">电脑管家</a></li>
                    </ul>
                    <ul>
                        <li><a href="">腾讯视频</a></li>
                        <li><a href="">腾讯社交广告</a></li>
                        <li><a href="">腾讯微云</a></li>
                        <li><a href="">智能电视网</a></li>
                        <li><a href="">腾讯云</a></li>
                        <li><a href="">当贝市场</a></li>
                    </ul>
                </div>
            </div>
            <div class="footerfooter">
                <ul class="footerlist1">
                    <li><a href="">关于腾讯|</a></li>
                    <li><a href="">About&nbsp;Tencent|</a></li>
                    <li><a href="">服务条款|</a></li>
                    <li><a href="">用户服务协议|</a></li>
                    <li><a href="">隐私政策|</a></li>
                    <li><a href="">权利声明|</a></li>
                    <li><a href="">广告服务|</a></li>
                    <li><a href="">腾讯招聘|</a></li>
                    <li><a href="">客服中心|</a></li>
                    <li><a href="">网站导航</a></li>
                </ul>
                <h5>Copyright © 1998 - 2021 Tencent. All Rights Reserved.</h5>
                <h5>腾讯公司 版权所有 网络文化经营许可证:<a href="">粤网文[2018]6725-2386号</a></h5>
            </div>
        </div>
    </div>
    
</body>

</html>